<template>
    <div class="question-wrap">
        <ul class="title">
            <li :class="{'active':ind <= index}" v-for="(item,ind) in question" :key="ind">
                {{item.type}}
                <i v-if="item.flag == true">v</i>
                <i v-else-if="item.flag == false">x</i>
            </li>
        </ul>
        <question-item></question-item>
    </div>
</template>
<script>
import questionItem from '../components/question-item'
import {mapState} from 'vuex'
export default {
    components:{
        questionItem
    },
    computed:{
        ...mapState(['question','index'])
    }
}
</script>

<style lang="scss">
    .title{
        width:100%;
        display: flex;
        li{
            margin:0 20px;
            padding:4px;
            background: gray;
            &.active{
                background:red;
            }
        }
    }
</style>

